<template>
	<view class="coupon-input-app">
		<view class="coupon-input" v-if="conponInputDialog.show">
			<view class="input">
				<input class="input" v-model="item.mtCode" placeholder="请输入团购码" />
			</view>
			<view class="buttons">
				<button class="button" @click="submit">确定</button>
				<button class="button" @click="scanItem" style="background-color: #1AAD19;">扫码</button>
			</view>
		</view>
		<view class="coupon-info-items"  v-if="couponInfoDialog.show">
			<view class="coupon-info-item">
				<view class="coupon-title">编号:</view><view class="coupon-info">{{couponInfo.code}}</view>
			</view>
			<view class="coupon-info-item">
				<view class="coupon-title">名称:</view><view class="coupon-info">{{couponInfo.title}}</view>
			</view>
			<view class="coupon-info-item">
				<view class="coupon-title">房间类型:</view><view class="coupon-info">{{couponInfo.type}}</view>
			</view>
			<view class="coupon-info-item">
				<view class="coupon-title">时间:</view><view class="coupon-info">{{couponInfo.time}}分钟</view>
			</view>
			<view class="buttons">
				<button class="button" @click="useCoupon">去使用</button>
				<button class="button" @click="inputAgain" style="background-color: #4cd964;">重新输入</button>
			</view>
		</view>
	</view>
</template>

<script>
	import util from "@/libs/util.js"
	import globalConfig from '../../../config'
	const baseHttp = globalConfig.API_HOST

	export default {
		data() {
			return {
				item: {
					mtCode: ''
				},
				statusLabels: ['待开放','空闲','使用中','保洁中','维护中'],
				couponInfoDialog: {
					show: false
				},
				conponInputDialog: {
					show: true
				},
				couponInfo: {
					code:"",
					price:0,
					time:0,
					title:"",
					type:""
				}
			}
		},
		onLoad(params) {

		},
		onReady() {

		},
		onSow() {

		},
		methods: {
			...util,
			scanItem() {
				uni.scanCode({
				    success:  (res) => {
						if (res.result) {
							this.item.mtCode = res.result;
							this.submit();
						} else {
							this.$Message.error("识别失败");
						}
				    }
				});
			},
			useCoupon() {
				this.goPage("/pages/tea/v2/houseList?mtCode="+this.couponInfo.code);
			},
			inputAgain() {
				this.conponInputDialog.show = true;
				this.couponInfoDialog.show = false;
			},
			submit() {
				if (this.item.mtCode) {
					this.$api.post('/mtconfig/getCodeInfo', {
						code: this.item.mtCode
					}).then((response) => {
						if (response.ret===1) {
							this.couponInfo = response.data;
							this.conponInputDialog.show = false;
							this.couponInfoDialog.show = true;
						} else {
							this.$Message.error(response.msg)
						}
					});
				} else {
					this.$Message.error("请输入团购码");
				}
			},
			goPage(url) {
				uni.navigateTo({url: url});
			}
		},
	}
</script>

<style lang="scss">
	page{
		/*height: 100%;*/
		background-color: #F5F4F8;
	}

	.page-section, .page-body {
		height: 100%;
	}

	.coupon-input-app {
		background-color: #F5F4F8;
		font-size: 28upx;
		.coupon-info-items{
			background-color: white;
			padding:20upx;
			.coupon-info-item{
				display: flex;
				padding:20upx;
				.coupon-title{
					width: 200upx;
				}
				.coupon-info{
					flex: 1;
				}
			}

		}

		.input {
			padding: 20upx;
			border: 1upx solid #eee;
			background-color: white;
		}
		.buttons {
			.button {
				margin:20upx;
				background-color:#1D2C6D;
				color:white;
			}
		}
	}

</style>
